<template>
  <el-form label-width="6vw">
    <template v-if="config.desiccantPlaceMethod == 1">
      <el-form-item label="坐标X1" title="交替摆放时，另一坐标X">
        <el-input-number v-model="config.x1" readonly></el-input-number>
      </el-form-item>
      <el-form-item label="坐标Y1" title="交替摆放时，另一坐标Y">
        <el-input-number v-model="config.y1" readonly></el-input-number>
      </el-form-item>
    </template>

    <el-form-item label="干燥剂规格">
      <el-input v-model="config.desiccantType"></el-input>
    </el-form-item>
    <el-form-item :label="$t('editFormula.weight')">
      <el-input-number v-model="config.weight" readonly></el-input-number>
    </el-form-item>
    <el-form-item label="色标高度">
      <el-input-number v-model="config.desiccantColorHeight"></el-input-number>
    </el-form-item>
    <el-form-item label="色标颜色">
      <el-input v-model="config.desiccantColor"></el-input>
    </el-form-item>
    <el-form-item label="摆放类型">
      <el-select v-model="config.desiccantPlaceMethod">
        <el-option label="正常摆放" :value="0"></el-option>
        <el-option label="交替摆放" :value="1"></el-option>
      </el-select>
    </el-form-item>
  </el-form>
</template>
<script setup>
import { watch } from "vue";
import { useI18n } from "vue-i18n";

let props = defineProps({
  config: {
    type: Object,
    default: () => ({}),
  },
});

const { t: $t } = useI18n();
let hasListen = false;
watch(
  () => props.config.desiccantPlaceMethod,
  (v) => {
    if (v == 1 && !hasListen) {
      hasListen = true;
      let config = props.config;
      let xv = config["x"];
      let yv = config["y"];
      Object.defineProperty(config, "x", {
        get() {
          return xv;
        },
        set(v) {
          xv = v;
          let cx = v + config.length / 2;
          config.x1 = +(-cx - config.length / 2).toFixed(2);
        },
      });
      Object.defineProperty(config, "y", {
        get() {
          return yv;
        },
        set(v) {
          yv = v;
          let cy = v + config.width / 2;
          config.y1 = +(-cy - config.width / 2).toFixed(2);
        },
      });
    }
  },
  {
    immediate: true,
  }
);
</script>
<style scoped lang="scss">
.el-form-item {
  margin-bottom: 10px;
}
.el-input-number {
  width: 100%;
}
</style>
